<template>
	<view class="sheet">
		<statusBar />
		<!-- 设置 -->
		<view @tap="leftIndex" class="nav">
			<image src="../../static/setup/jiantou.png" mode=""></image>
			<view>预订单</view>
		</view>
			<!-- 滚动待处理 -->
			<view class="rolling">
				<u-tabs name="cate_name" :bar-height="10" active-color="#FDC345" :list="list" :is-scroll="true" :current="current" @change="change"></u-tabs>
			</view>
			<view class="Child">
				<Scrolling></Scrolling>
			</view>
	</view>
</template>
<script>
import { mapActions, mapState } from 'vuex';
import { toast } from '@/utils/toast';
import request from '@/utils/request';
import statusBar from '../../components/statusBar/statusBar.vue';
import Scrolling from './components/Scrolling.vue';
export default {
	data() {
		return {
			current: 0,
			list: [
				{
					name: '全部'
				},
				{
					name: '90分钟'
				},
				{
					name: '今日'
				},
				{
					name: '明日'
				},
				{
					name: '13日'
				},
				{
					name: '14日'
				},
				{
					name: '15日'
				}
			],
		};
	},
	components: {
		statusBar,
		Scrolling
	},
	methods:{
		leftIndex(){
			uni.navigateBack({
			    delta: 1,
			
			});
		},
		change(index) {
			this.current = index;
		},
	}
};
</script> 
<style lang="scss" scoped>
	.sheet{
		
	.nav {
		display: flex;
		align-items: center;
		padding: 50upx 30upx 31upx 30upx;
		background: $bg1-color;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 9999;
		
		image {
			width: 27upx;
			height: 30upx;
			display: flex;
		}
		& > view {
			font-size: 34upx;
			font-family: Source Han Sans CN;
			font-weight: bold;
			color: $bg2-color;
			margin-left: 30upx;
		}
	}
	 .rolling {
	 	padding-top: 100upx;
		background: $bg1-color;
		/deep/.u-tab-item {
		
		
			color: $bg3-color !important;
		}
		}
		.Child{
			background: $bg1-color;
			margin-top: 24upx;
			width: 93%;
			margin: 0 auto;
		}
	}
</style>